<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="../../../css/mui.min.css"/>
		<link rel="stylesheet" type="text/css" href="../../../css/pages/PropertyPayCost.css"/>
	</head>

	<body>
		<div id="app">
			<div class="header-title">物业缴费</div>
			<div class="list">
				<div class="item" v-for="item in list" @click="itemClick(item)">
					<div class="item-icon">
						<img :src="item.icon" >
					</div>
					<span class="title" v-text="item.title"></span>
				</div>
			</div>
		</div>
		<script src="../../../js/Width.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../../js/mui.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../../js/vue.js" type="text/javascript" charset="utf-8"></script>
		<script src="https://cdn.bootcss.com/fastclick/1.0.6/fastclick.min.js"></script>
		<script type="text/javascript">
			mui.init()
			mui.plusReady(function () {
				if (!mui.os.android) {
					FastClick.attach(document.body);
				}
			})	
			var app = new Vue({
				el: "#app",
				data: {
					list: [
						{
							icon: '../../../images/home/payment/wuye.png',
							title: '物业费',
							url: 'tenement.html'
						},{
							icon: '../../../images/home/payment/shui.png',
							title: '水费'
						},{
							icon: '../../../images/home/payment/dian.png',
							title: '电费'
						},{
							icon: '../../../images/home/payment/tian.png',
							title: '天然气'
						},{
							icon: '../../../images/home/payment/nuan.png',
							title: '暖气'
						},{
							icon: '../../../images/home/payment/qita.png',
							title: '其他'
						},
					]
				},
				methods: {
					itemClick: function (item) {
						if(item.url){
							mui.openWindow({
								url: item.url,
								id: item.url,
								styles: { // 窗口参数 参考5+规范中的WebviewStyle,也就是说WebviewStyle下的参数都可以在此设置
									titleNView: { // 窗口的标题栏控件
										titleText: " ", // 标题栏文字,当不设置此属性时，默认加载当前页面的标题，并自动更新页面的标题         
										backgroundColor: "#ffffff", // 控件背景颜色,颜色值格式为"#RRGGBB",默认值为"#F7F7F7"
										autoBackButton: true,
									}
								},
								waiting: {
									autoShow: false
								}
							})
						}else{
							mui.alert(item.title+ '的功能暂未开发')
						}
					}
				},
			})
		</script>
	</body>

</html>
